<template>
  <div>
    <div class="part-title divider-inside">
      Part IV Employer Contact Information (continued)
    </div>
    <div class="table-container">
      <div class="table divider-inside" v-for="item in data" :key="item.id">
        <div class="table-grid">
          <div class="table-row">
            <div class="table-label ">Aircraft Owner</div>
            <div class="table-value">{{item.aircraft_owner}}</div>
          </div>
          <div class="table-row">
            <div class="table-label ">Work Nature</div>
            <div class="table-value">{{item.work_nature}}</div>
          </div>
          <div class="table-row ">
            <div class="table-label ">Activity Start Date</div>
            <div class="table-value">{{item.start_time}}</div>
          </div>
          <div class="table-row ">
            <div class="table-label ">Activity End Date</div>
            <div class="table-value">{{item.end_time}}</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { inject } from "vue";

const journalData: any = inject("journalData");
const data = journalData.value[4].data;
</script>
<style scoped lang="less">
@import url("../less/index.less");
.content {
  min-height: 500px;
  padding: 30px 50px;
  box-sizing: border-box;
  .border();
}
</style>
